<template>
  <el-container style="width:1850px;height:1070px;background-color: #06134A" onscroll="false">
    <el-aside style="width: 100% ;height: 100%">
      <el-row style="width:100%; height: 50%">
        <el-col :xs="24" :sm="24" :lg="8" style="width:50%;height:400px;">
          <bar-char1></bar-char1>>
        </el-col>
        <el-col :xs="24" :sm="24" :lg="8" style="width:50%;height:400px;">
          <bar-char2></bar-char2>
        </el-col>
      </el-row>

      <el-row style="width:100%; height: 50%">
        <el-col :xs="24" :sm="24" :lg="8" style="width:50%;height:400px;">
          <pie-char></pie-char>
        </el-col>
        <el-col :xs="24" :sm="24" :lg="8" style="width:50%;height:400px;">
          <pie-char2></pie-char2>
        </el-col>
      </el-row>

    </el-aside>
  </el-container>
</template>

<script>
  import BarChar1 from './components/barChar1'
  import BarChar2 from './components/barChar2'
  import PieChar from './components/pieChar'
  import PieChar2 from './components/pieChar2'
  export default {
    name: 'index',
    components: { PieChar2, PieChar, BarChar2, BarChar1 }
  }
</script>

<style scoped>

</style>
